約 4,418,675 件
https://w.atwiki.jp/sumaho_browser/pages/11.html
非営利団体Mozillaが開発するオープンソースのブラウザ トラッキング防止機能などプライバシー重視な機能が多い 関連リンク 公式サイト Github + タップして目次を開く iOS版基本情報 Android版基本情報 トップページとメニュー 強化型トラッキング防止 アドオン about config(リリース版不可) ベータ版と旧バージョン Firefox Beta(Androidのみ) Firefox Nightly(Androidのみ) Firefox 68.11.0 Firefox派生ブラウザFirefox Focus Iceraven Fennec F-Droid Fennec F-Droid68.12.0 Mull SmartCookieWeb Preview 投票・コメント・お問い合わせ iOS版 編集者大募集! 出典:「Firefox Private, Safe Browser」をApp Storeで 最終閲覧日2024年4月29日 App Storeからダウンロード 基本情報 販売元 Mozilla(アメリカ) 互換性 iOS 15.0〜 アプリのサイズ 148.4MB Android版 uBlock Originが100%の性能を発揮出来るのはAndroid版Firefoxのみ 以前の大幅なバージョンアップによりユーザーを減らしたが、最近は使用出来るアドオンも増えて使い勝手が良くなってきた 出典:Firefox 高速プライベートブラウザー - Google Play のアプリ 最終閲覧日2024年4月29日 Google Playでダウンロード または FirefoxCIからAPKファイルをダウンロード GitHubからAPKファイルをダウンロード ftp.mozilla.orgからAPKファイルをダウンロード Githubとftp.mozilla.orgはAPKファイルの更新が止まっている? 基本情報 提供元 Mozilla(アメリカ) 要件 Android 5.0〜 アプリのサイズ 283MB 評価 項目 点数 備考 速度 ★★★★☆ 大きな問題は無い 機能 ★★★★★ 好きなアドオンを追加可能 操作性 ★★★★☆ ブックマーク管理以外は良好 信頼性 ★★★★★ 問題無し 機能早見表 広告ブロック 追跡ブロック ジェスチャー 翻訳 ページ保存 ◎※¹ ◎ ◯※¹ ◯※¹ ◯※¹ スピードダイアル 同期 UA変更 ブックマークインポート/エクスポート ツールバー位置選択 ◯ ○ ◯※¹ ✕ ◯ ※¹アドオンの追加が必要 トラッカー・権限 exodus https //reports.exodus-privacy.eu.org/en/reports/org.mozilla.firefox/latest/ トラッカー 権限 4 32 + ... 非営利団体Mozillaが開発するオープンソースのブラウザ トラッキング防止機能などプライバシー重視な機能が多い uBlock Originが100%の性能を発揮出来るのはFirefoxのみ 以前の大幅なバージョンアップによりユーザーを減らしたが、最近は使用出来るアドオンも増えて使い勝手が良くなってきた 機能早見表 機能早見表 可否 備考 広告ブロック ◎ uBlock originで可能Androidブラウザでは最高レベル 追跡ブロック ◎ 強化型トラッキング防止機能 + uBlock Origin ジェスチャー △ アドオンを追加すれば可能 翻訳 △ アドオンを追加すれば可能 ページ保存 △ アドオンを追加すれば可能 スピードダイアル ○ ︙メニュー→トップサイトに追加 同期 ○ PC版と同期可能 データ圧縮 △ アドオンを追加すれば可能 UA変更 △ アドオンかabout configで可能 ブックマークインポート/エクスポート ✕ 不可 ツールバー位置選択 ○ 可能 トラッカー3個 追跡早見表 備考 Adjust https //www.adjust.com/ja/ Google Firebase Analytics https //firebase.google.com/docs/analytics?hl=ja Mozilla Telemetry https //support.mozilla.org/ja/kb/share-data-mozilla-help-improve-firefox 基本情報 公式ページ https //www.mozilla.org/ja/firefox/browsers/mobile/ 提供元/所在地 Mozilla/アメリカ サイズ iOS/91.8MB Android/296MB(参考値) ダウンロード iOS/App Store Android/Google Play・ftp.mozilla.org・Github トップページとメニュー デフォルトのトップページ ︙メニュー デフォルトのトップページ ︙メニューの「ショートカットに追加」で選択したページが表示される ︙メニューの「コレクションに追加」で選択したページが追加される…が、過去にそのページを訪問した時のキャッシュが表示されるらしい(最新の状態ではない)ので注意 ︙メニュー アドオンの設定やトップページに追加など 強化型トラッキング防止 トラッカー防止用アドオンのDisconnect提供のリストを使用してwebサイトのトラッカーをブロックしてくれる機能 トラッカーとはwebサイトを閲覧した人の情報を収集するプログラムの事 全てのトラッカーが悪い訳では無いが不必要なトラッカーをブロックする事で自身のプライバシーを守れる 選べるのは標準・厳格・カスタムの3種類 厳格を選んだ場合サイトの表示が崩れる事もある ブロックするのは SNSメディアトラッカー(標準/厳格) クロスサイトトラッキングCookie(標準/厳格) 暗号通貨マイニング(標準/厳格) フィンガープリント採取(標準/厳格) リダイレクトトラッカー(標準/厳格) トラッキングコンテンツ(厳格) カスタムを選んだ場合はどれをブロックするか一つずつ選べる アドオン Android版ではアドオンを使用出来るので簡単に解説 ︙メニュー→「アドオン」→「アドオンマネージャー」にモバイル版でも動作が確認された著名なアドオンのリストが表示される 追加するには右側の+をタップして「追加しますか?」のダイアログで追加を選べば完了 リスト最下部の「アドオンを探す」をタップするとhttps //addons.mozilla.org/ja/android/が開き さらに数多くのアドオンを探してインストールする事が出来る(現在500個以上のアドオンに対応) アドレスバーに「https //addons.mozilla.org/ja/firefox/」と入力するとデスクトップ向けのアドオンも表示される Android版Firefoxには未対応の場合が多いが︙メニュー→デスクトップサイト をオンにすればインストール可能 動作するかは別問題 アドオン詳細ページで「ファイルをダウンロード」をタップするとxpiファイルとしてダウンロード可能 初期状態で追加可能なアドオン 名前 備考 uBlock Origin ★おすすめ広告や不要な要素をブロック/非表示にする為のコンテンツブロッカー。特に理由が無ければフィルタはデフォルトでOK。これ目当てでFirefoxを使用してる人も多いはず。 Dark Reader ダークテーマ(背景が黒くなる) FoxyProxy Standard プロキシ管理 AdGuard AdBlocker 広告ブロック Tampermonkey ユーザースクリプトマネージャー Privacy Badger 追跡ブロック Bitwarden パスワード管理 Ghostery 広告ブロック NoScript Security Suite 悪意のあるスクリプトなどをブロック Read Aloud A Text to Speech Voice Reader 音声読み上げ Search by Image 画像検索 ClearURLs URLから追跡など不要な文字列を削除 Decentraleyes CDNへのアクセスを減らし、プライバシーの保護と読み込み速度を向上させる Firefox Relay 使い捨てメールアドレスが利用出来る利用にはMozillaアカウントが必要Mozilla製 YouTube High Definition YouTubeに機能追加 Web Archives 削除されたページをアーカイブやキャッシュから検索する Video Background Play Fix YouTubeとVimeoでバックグラウンド再生を可能にする Tomato Clock ポモドーロ・テクニックを使用する為のタイマー Google Search Fixer ★おすすめFirefoxでGoogle検索を使用する時にChromeなどと同じ画面にしてくれる(FirefoxデフォルトでGoogle検索を使用すると画面や検索結果が微妙に違う) その他おすすめアドオン (デ)の付いたアドオンは表示をデスクトップモードにしてhttps //addons.mozilla.org/ja/firefox/からアクセスしないと検索しても出てこないしインストールも出来ない 名前 備考 Simple Gesture Firefoxでジェスチャー操作を可能にする Tablet UI for Firefox(デ) Firefoxにタブバーを実装する TWP - Translate Web Pages ウェブページをリアルタイムで翻訳する Dark Background and Light Text ウェブページをダークテーマにするDark Readerよりも軽い User-Agent Switcher and Manager(デ) ユーザーエージェントを変更してページの表示を変える一部のFirefoxをサポート対象外にしているサイトなどで有効 SingleFile Webページをhtml形式で保存する。Chromium系のページ保存よりやや時間がかかるが今開いてる全タブ保存、不要な要素を削除して保存などが出来る カスタムアドオンコレクション + もうカスタムアドオンコレクション無しでアドオンの追加出来るので折りたたみにしました カスタムアドオンコレクションを使用すれば上記リストに無いアドオンもインストール出来る リリース版不可 Mozillaアカウントが必要です。事前にメールアドレスでアカウントを作成し、ログインしておきましょう。 カスタムアドオンコレクションの作り方とアドオンの追加 https //addons.mozilla.org/ja/firefox/を開きます 検索で使用したいアドオンのページを開き下部にある「コレクションを選択」をタップ 初めての場合は「新しいコレクションを作成」をタップ コレクション名を決める(自分がわかればなんでもよい) 説明は書く事が無ければ空欄でよい カスタムURLの数字8ケタと末尾の文字列はこの後使うので重要(作成後は変更不可) 数字8ケタは「コレクションの所有者(ユーザーID)」 英数字文字列は「コレクション名」として使用する 「新しいコレクションを作成」をタップ すでに自分のコレクションがある場合はコレクション名をタップ uBlock Originなどのデフォルトで利用可能なアドオンもコレクションに追加しておくと便利 (カスタムアドオンコレクション使用中はデフォルトのアドオンリストが使用出来ない為) 作成したカスタムアドオンコレクションを登録する カスタムアドオンコレクションのURLは次のようになっている 「https //addons.mozilla.org/ja/firefox/collections/16122873/test/」 この場合 「コレクションの所有者(ユーザーID)」に16122873 「コレクション名」にtestと入力すればよい コレクション名に日本語など英数字以外を使用した場合はカスタムURL末尾に追加した英数字をコレクション名として使用する ︙メニュー→設定→「Firefox ○○について」(○○の部分はBetaやNightlyなど)をタップ→Firefoxのロゴマークを5回タップ 設定のアドオンの下に「カスタムアドオンコレクション」があるのでタップ 「コレクションの所有者(ユーザーID)」に先程のカスタムURLの8ケタの数字を入力 「コレクション名」に自分が決めた名前を入力 「OK」をタップするとFirefoxが再起動して︙メニュー→「アドオン」に使用したいアドオンが表示されてインストール可能になる 自分でカスタムアドオンコレクション作るのが面倒or無理な場合 Iceravenの作者が公開しているコレクションを登録するのがよい↓ コレクションの所有者(ユーザーID)「16201230」 コレクション名「What-I-want-on-Fenix」 ただしVideo DownloadHelperなど絶対Android版Firefoxにはインストール出来ないものも含まれるので注意 あとコレクション内のアドオンが多すぎて一部しか表示されない 当wiki管理人もリスト作成して公開してます コレクションの所有者(ユーザーID)「16122873」 コレクション名「sumaho_browser」 カスタムアドオンコレクションで利用可能なおすすめアドオン 名前 備考 TWP - Translate Web Pages ページを丸ごと翻訳 Simple Gesture ジェスチャー機能 User-Agent Switcher and Manager ユーザーエージェント変更 about config(リリース版不可) アドレスバーにabout configと入力する事で隠し設定画面に入れる 種類多すぎて筆者もよく分かってないのでとりあえず今使ってるのを紹介 有識者による加筆修正大歓迎 general.useragent.override ユーザーエージェントを変更する為のもの。使用するには アドレスバーに「about config」と入力 +をタップして名前を「general.useragent.override」「真偽値」を「文字列」に変更 「文字列を入力」欄に好みのユーザーエージェントを入力して新規作成を選べば完了 使い道は「常にデスクトップ版サイトを見たいのでPCのユーザーエージェントを選択」 「Firefox非対応のサイトをChromeに偽装して閲覧」など アクセシビリティサービスを無効にする accessibility.force_disabled アクセシビリティサービスを無効にするとメモリ使用量が削減されパフォーマンスが改善される 値を0から1に変更すると無効になる ページ内検索で一致した単語をすべて強調表示する findbar.highlightAll 値をtrueにすると選択した単語は緑色でそれ以外はピンク色で強調表示される AMO(addons.mozilla.com)で拡張機能を使用可能にする extensions.webextensions.restrictedDomains 値を空白にする privacy.resistFingerprinting.block_mozAddonManager 値をtrueにする ベータ版と旧バージョン Firefox Beta(Androidのみ) ダウンロード Android/Google Play 隠し設定のabout configが使える 追記:カスタムアドオンコレクションが使用出来る様になった Firefox Nightly(Androidのみ) ダウンロード Android/Google Play 不安定 カスタムアドオンコレクションというめんどくさい複雑な設定を行う事で リリース版では使えないアドオンをインストールする事が出来る インストール出来ても動くかどうかは別の問題なので上級者向け 公式ページの説明↓ https //blog.mozilla.org/addons/2020/09/29/expanded-extension-support-in-firefox-for-android-nightly/ Version 120以降でhttps //addons.mozilla.org/ja/firefox/にアクセスすればカスタムアドオンコレクション無しでアドオンを追加出来る 安定版でも出来る様になった Firefox 68.11.0 ダウンロード Android/Mozilla 2020年8月頃にFirefoxは別物と言えるほど大幅なアップデートを行いユーザー離れが加速した これは大幅アプデ前の最終バージョンで現在でも使用しているユーザーも少なくない 今でもMozilla公式で配信しているので安心 追記 uBlock Origin最新版が使用不可になった Firefox派生ブラウザ この辺をその他のブラウザに移動させようか検討中 Firefox Focus ダウンロード iOS/App Store Android/Google Play・Github プライバシーを重視したブラウザ ワンタップで履歴を消去出来る 広告とトラッキングのブロックも出来る ブックマークは無いがよく見るサイトをトップページに登録可 Githubで配布されているBeta版はabout configが使用可 Iceraven ダウンロード Android/GitHub リストに無いアドオンのインストールがNightlyですら出来なかった時代に生まれた、interfect氏によるFirefoxのフォーク(改造版)。 デフォルトで大量にアドオンが登録されており、about config・カスタムアドオンコレクション使用可。。 現在はakliuxingyuan氏にメンテナンスを譲ったようだ。 Fennec F-Droid ダウンロード Android/F-Droid 完全オープンソースのアプリのみを集めたアプリストアF-Droidが配布するFirefox Mozilla版のFirefoxはごく一部にオープンソースではないコードが使用されているため、それを削除してビルドしている about configやカスタムアドオンも使用可 デフォルトでテレメトリとトラッカーが削除されている 弱点はアドオンの設定画面が英語表記になってしまう事 Fennec F-Droid68.12.0 Fennec F-Droidも本家Firefoxと同じ時期に大幅アップデートがあったので一応旧バージョンも紹介 3種類あるので各自自身の端末に合うバージョンをインストールしてください https //f-droid.org/archive/org.mozilla.fennec_fdroid_689420.apk https //f-droid.org/archive/org.mozilla.fennec_fdroid_689410.apk https //f-droid.org/archive/org.mozilla.fennec_fdroid_689400.apk 追記 uBlock Origin最新版が使用不可になった Mull https //f-droid.org/packages/us.spotco.fennec_dos/ プライバシー・セキュリティを強化する目的でデスクトップ版Firefox用に開発されたarkenfox/user.jsをAndroid版Firefoxに使用したブラウザ about configやカスタムアドオンも使用可 デフォルトでテレメトリとトラッカーが削除されている プライバシー・セキュリティ面は非常に優れるがサイトの表示が崩れる場合もある 参考 Androidブラウザのプライバシー比較 https //privacytests.org/android SmartCookieWeb Preview 公式サイト https //smartcookieweb.com/ Github https //github.com/CookieJarApps/SmartCookieWeb-Preview/releases Playストア https //play.google.com/store/apps/details?id=com.cookiejarapps.android.smartcookieweb FirefoxベースだがUIを改良してある。主な変更点は エッジスワイプでブックマーク・タブ呼び出しが出来る ブックマークのインポート・エクスポートが出来る(独自形式) アドオンのサイドロードが出来る https //addons.mozilla.org/firefoxで使いたいアドオンを探す 「ファイルをダウンロード」を長押しでアドレスコピー 「Setting」→「Advanced Setting」→「Sideload XPI」に先程のアドレスを貼りOKでインストール完了 投票・コメント・お問い合わせ 選択肢 投票数 投票 👍 0 👎 0 名前 コメント すべてのコメントを見る 管理人へのお問い合わせはこちら
https://w.atwiki.jp/nicopark/pages/37.html
Firefox 側の設定 以下、Ubuntu 9.10 でやっている内容。再設定の時のためのメモ。 firefox の新規プロファイルを作る DOM Inspector (firefox の extension として提供されている) を入れる。 about config nglayout.debug.disable_xul_cache true:Firefoxには,一度読み込んだXULをキャッシュして二度目以降の表示を高速化する機能がある。このキャッシュ機能を無効にすることで,XULを再読み込みしたときにつねに最新の内容で表示されるようになる。Firefoxを再起動せずに拡張機能を試せる。ただしFirefoxが異常に重くなるので、速いPCで無いと辛い。→ これで、新規にウインドウを開くだけで、変更の確認が出来る。(ただし、chrome.manifest の修正時のみ再起動が必要。他「修正したソースファイルの動作を確認するには」参照) about config browser.dom.window.dump.enabled true:デバッグ用のdumpメソッドを使用可能にする.コラム「JavaScriptデバッグ方法」を参照 about config javascript.options.showInConsole true:JavaScriptのエラーをエラーコンソールへ出力するようにする about config javascript.options.strict true:JavaScriptのエラー出力を厳密にする
https://w.atwiki.jp/keiplus/pages/23.html
JavaScript ECMAScript JavaScript TypeScript 本項は書きたての記事です。正確な情報は公式サイト、公式ドキュメント、記載の参照サイトでご確認ください。 目次 + 読む JavaScript目次 概要 TypeScript 主なビルトイン関数など 歴史 参考 概要 1995年、Brendan Eich氏を初めとするMozilla社によって開発されたウェブブラウザ向けスクリプト言語。 Mocha、LiveScriptと呼ばれていたが当時のSUN microsystems社と提携関係あったことからJavaScriptと改称された。 JavaScriptはMicrosoftや開発者たちとの権利争いがあって実質2009年で開発が中断されている。 2015年ごろからECMAScriptがEU諸国手動で開発が進行し、毎年メンテナンスされて更新されている。 TypeScript 2012年にMicrosoftがリリース。ver1.0は2014年リリース。 ECMAScriptをベースとしており、TypeScriptで書かれたコード(.ts)はコンパイル(トランスコンパイル・トランスパイル)で.jsファイルを出力してブラウザ上で動作する形。 開発環境としてnode.js/npmの環境が必要となる。 型の異なる関数呼び出し、代入などをコンパイル時に検出することで品質を高めることができる。 React、Angular、Vue、expressなど主要JSフレームワークで採用されておるデファクトスタンダードである。 主なビルトイン関数など 別ページ「JavaScript/関数」に記載 歴史 + 読む Edition Date published Changes from prior edition 1 Jun-97 First edition 2 Jun-98 Editorial changes to keep the specification fully aligned with ISO/IEC 16262 international standard 3 Dec-99 Added regular expressions, better string handling, new control statements, try/catch exception handling, tighter definition of errors, formatting for numeric output and other enhancements 4 Abandoned Fourth Edition was abandoned, due to political differences concerning language complexity. Many features proposed for the Fourth Edition have been completely dropped; some are proposed for ECMAScript Harmony. 5 Dec-09 Adds "strict mode", a subset intended to provide more thorough error checking and avoid error-prone constructs. Clarifies many ambiguities in the 3rd edition specification, and accommodates behaviour of real-world implementations that differed consistently from that specification. Adds some new features, such as getters and setters, library support for JSON, and more complete reflection on object properties.[9] 5.1 Jun-11 This edition 5.1 of the ECMAScript Standard is fully aligned with third edition of the international standard ISO/IEC 16262 2011. 6 June 2015[10] The Sixth Edition, known as ECMAScript 2015,[11] adds significant new syntax for writing complex applications, including classes and modules, but defines them semantically in the same terms as ECMAScript 5 strict mode. Other new features include iterators and for/of loops, Python-style generators and generator expressions, arrow functions, binary data, typed arrays, collections (maps, sets and weak maps), promises, number and math enhancements, reflection, and proxies (metaprogramming for virtual objects and wrappers). As the first “ECMAScript Harmony” specification, it is also known as “ES6 Harmony”. 7 Work in progress The Seventh Edition is in a very early stage of development, but is intended to continue the themes of language reform, code isolation, control of effects and library/tool enabling from ES6. New features proposed include concurrency and atomics, zero-copy binary data transfer, more number and math enhancements, syntactic integration with promises, observable streams, SIMD types, better metaprogramming with classes, class and instance properties, operator overloading, value types (first-class primitive-like objects), records and tuples, and traits.[12][13] 参考 ECMAScript - Wikipedia, the free encyclopedia https //en.wikipedia.org/wiki/ECMAScript
https://w.atwiki.jp/comcatet/pages/32.html
内包表記 ループ処理を簡単簡潔に記述する方法。 検索するとPythonの記事が多いから、そちらから取り込んだ? 元々ECMAScript6の機能として提案されていたが、ECMAScript7に先送りされている。 現時点ではFirefoxのみの実装? 配列内包とジェネレータ内包の表記がある。FirefoxではJavaScript1.7(Firefox2)で配列内包が実装されているが、今のとは表記が違う実装だった。ECMAScript7互換表記の配列内包とジェネレータ内包はFirefox30から実装された。今後も表記が変わる可能性がある。 [for (x of iterable) x*x] [for (x of iterable) if (x foo) x] [for (x of iterable) for (y of iterable) x + y] Array comprehensions - JavaScript | MDN es6 generator and array comprehensions in spidermonkey -- wingolog
https://w.atwiki.jp/kayo_2525/pages/5.html
大見出し 書き方? 中見出し HTMLファイルに書く場合:ヘッダ・ボディ・タグの3ヶ所に書けます。
https://w.atwiki.jp/naobe/pages/73.html
言語に戻る はじめに Netscape社が制定。IEのJScriptとの互換性に問題があり、ECMAの標準規格ECMA-262(JavaScript1.1がベース)が制定され、この規格がJavaScriptの標準規格となった。 2009年時点では、JavaScript1.5~1.7。JavaScript2.0が現在検証中。 文法 コメント //コメント /* コメント */ 演算子 typeof演算子 オペランドに変数を用い、変数の型を表す文字を返す。"string","number","boolean","object","function","undefined"のどれかを返す。 等値演算子(==)と同値演算子(===) ==は型変換を行って、同じ値か確認する。===は型も含めて同じであるか判定する。 【例】 var a = "1"; var b = 1; if( a == b) { document.write("等値 br "); } else { document.write("等値でない br "); } document.write(" br "); if( a === b) { document.write("同値 br "); } else { document.write("同値でない br "); } document.write(" br "); 正規表現 JavaScript1.2から正規表現に対応。 修飾子 g マッチしたものを全て出力。 i 大文字と小文字を区別しない。 例 script !-- var a = "That pen s price is 100$. this pen s price is 200$"; var regx = /[0-9]+/g; var b = a.match(regx); document.write("検索対象文字列" + a + " br "); document.write("正規表現" + regx + " br "); document.write("マッチした文字:" + b + " br "); //-- /script 条件分岐 if 繰り返し処理 while() {} while(条件) { ステートメント } 条件が真の間、ステートメントを実行する。 do { ステートメント } while(条件); 条件が真の間、ステートメントを実行する。最初のステートメントは無条件で実行する。 for in for(プロパティ in オブジェクト) { } オブジェクトのプロパティ名全てに対して処理する。 【例1】 for(var property in navigator) { document.write(navigator[property]); document.write(" br "); } 関数 機能をモジュール化して、共通化する。資源の節約、バグの低減に有効。 書式 function 関数名(引数) { 処理 [return 式] } 関数リテラル 関数を変数(オブジェクト)に代入して使う。 【例】 var func = function(x,y) { return x * y; } func(10, 20); 変数 関数の外部で定義した変数は関数内で使える(グローバル。C言語と同じ)。 【例】 var aaa = "aaa"; function func(x,y) { return aaa; } window.self 自身のwindowオブジェクト window.opener マルチウィンドウの親 windo.parent フレーム分割の1つ親 with文 共通するオブジェクトの記述を省略するために使う。 書式 with(オブジェクト) { } 例 with(document) { write("aaa"); write("bbb"); } 配列 引数は文字列に変換され連想配列として作成される。 初期化 a = []; 代入 a[0] = 1; a[1] = 2; 削除 delete a[0] a[0]がundefinedになり、a[1]は残る。 先頭の抽出 b = a.shift() aの先頭は削除。 最後の抽出 b = a.pop() aの最後は削除。 指定位置の抽出 b = a.slice(start, [end]) endがなければ最後まで。aは変化しない。bは配列になる。 オブジェクト コンストラクタ関数を作成し、newして使う。メソッドは、クラス固有なのでprototypeプロパティに設定する。 【例】 //長方形 function Rectangle(x, y){ this.x = x; this.y = y; } Rectangle.prototype.area = function(){ return this.x * this.y; } var rect = new Rectangle(10, 20); document.write("x:" + rect.x + " br "); document.write("y:" + rect.y + " br "); document.write("面積:" + rect.area() + " br "); クラスプロパティ コンストラクタ関数のプロパティ。定数を表すために使う。名前空間としてクラスを使い名前衝突を防ぐ。 【例】 Number.MAX_VALUE クラスメソッド コンストラクタ関数の関数。汎用的な関数を表すために使う。名前空間としてクラスを使い名前衝突を防ぐ。 【例】 Date.parse() クラスの継承 プロトタイププロパティを利用して、継承したクラスを作成する。 【例】 // クラスの継承 function PointedRectangle(w, h, x, y) { Rectangle.call(this, w, h); this.x = x; this.y = y; } // メソッドを継承させる PointedRectangle.prototype = new Rectangle(); // プロトタイププロパティを削除 delete PointedRectangle.prototype.width; delete PointedRectangle.prototype.height; // コンストラクタを元に戻す PointedRectangle.prototype.constructor = PointedRectangle; var prect = new PointedRectangle(20, 40, 200, 400); 連想配列 プロパティのアクセス方法には以下の2とおりの方法がある。 obj.property = 値; obj["property"] = 値; 2番目の方法を使うとプロパティ名を変数として与えることができるので、連想配列として使える。 WEBアプリケーション Java Scrriptの記述 script タグの中に本体を記述。 script は、何回でも、どこにでも記述可能。ただし呼び出しの前に本体を記述しなければならない。 header タグの中に記述する場合が多い。 JavaScriptに対応していないブラウザに対処するために以下の書式を使う。 script !-- ・・・ //-- /script イベントハンドラ onclick リンク、ボタンの属性。JavaScriptの関数を指定する。falseを返すと、デフォルト処理をキャンセルする(フォームのときは、送信しない。)。 onload body タグに指定する。ドキュメントや画像などの外部コンテンツが完全に読み込まれたときにこのイベントハンドラが呼び出される。 右クリック禁止 body oncontextmenu="return false"" 外部JavaScriptファイル参照 script type="text/javasctipt" src="XXX.js" /script 組み込みメソッド setTimeout(実行する関数, 遅れ時間(ms)) 【例】 ar timer = false; function foo(){ if(timer == false){ setTimeout(function() { timer = true; foo(); timer=false; }, 2000); return; } alert("hello!"); } foo(); 【例12】 var isTrx = 0; var delayTime = 5000; //2重押下抑止 function check() { if (isTrx == 1) { return false; } isTrx = 1; setTimeout( isTrx = 0; , delayTime); return true; } テクニック [Enter]キーでフォームの内容が送信されるのを防ぐ記述 form action="***" method="***" onsubmit="return false;" オブジェクトモデル window +--document | +-- anchors[] | +-- applets[] | +-- Area | +-- forms[] | | +-- elements[] 要素は、Button,CheckBox,・・・ | | +-- Button | | +-- CheckBox | | +-- FileUpload | | +-- Password | | +-- Hidden | | +-- Radio | | +-- Reset | | +-- Select | | | +-- options[] | | | | | +-- Submit | | +-- Text | | +-- Textarea | +-- images[] | +-- links[] +-- history +-- location +-- frames[] +-- navigator +-- screen windowは、ブラウザウィンドウまたはフレームを表す。 フォーム フォーム全体:forms フォームの各要素:elements 添え字によるアクセス document.forms[1].elements[2] ・・ 2番目のformの3番目の要素(button,password,radiobox,textareaなど ) 名前によるアクセス html form name="f1" /form form name="f2" /form /html 上記例では、document.f2 イベント イベント 発生タイミング イベントハンドラ 対象オブジェクト blur ユーザのフォーカスが離れたとき onBlur テキストフィールド focus フォーカスされたとき onFocus テキストフィールド click クリックしたとき onClick ボタン、ラジオボタン、チェックボックス、サブミットボタン、リンク、リセットボタン change 値が変更されたとき onChange テキストフィールド load WebページがWebブラウザにロードされたとき onLoad bodyタグ unload 別のページに移動したとき onUnLoad bodyタグ 【例 onLoad】 body onLoad="alert( ロードしました )" 【例 onUnLoad】 body onUnLoad="alert( 移動しました )" 動作しない!! 新たにウィンドウを開く window.open(URL, ターゲット, フィーチャ); URL ロードするサイトのURL ターゲット フィーチャ 何も設定しなければ、起動もとのウィンドウと同じ。一つでも設定すれば、設定した項目のみ有効。 項目 説明 height=X ウィンドウの高さ width=X ウィンドウの幅 left=X ウインドウの画面左からの位置 top=X ウインドウの画面トップからの位置 location URL入力用のバーを表示 menubar メニューバーを表示 resizable ウィンドウのサイズを変更可能にする status ウィンドウ下のステータスバーを表示 scrollbars スクロールバーを表示 セキュリティ JavaScriptでできないこと クライアントのファイルに対して読み書きができない。 ネットワーク機能自体をサポートしない(生のTCP/IPを使えない) 別ブラウザを開くのは、ボタンクリックなどのユーザ操作に対してのみ。(無制限なポップアップウィンドウ表示をなくすため) クローズできるのは、自分が開いたウィンドウのみ 小さなウィンドウ(100ピクセル以下)を開くことはできない。 スクリプトをロードしたサーバと異なるサーバからロードしたドキュメントを操作することはできない。(同一出身ポリシー) 作成例 html head meta http-equiv="Content-Type" content="text/html; charset=UTF-8" meta http-equiv="Content-Style-Type" content="text/css" meta http-equiv="Content-Script-Type" content="text/javascript" title JavaScriptテスト /title style type="text/css" !-- h1 {font-size 14pt}; h2 {font-size 12pt} -- /style /head body oncontextmenu="return false" onLoad="alert( ロードしました )" onunload="alert( ページを移動しました )" h1 単純な文字出力 /h1 script type="text/javascript" !-- document.write("Hello Java Script."); //-- /script h1 外部ファイル /h1 script type="text/javascript" src="aaa.js" /script h1 正規表現 /h1 h2 マッチした文字を返す /h2 script !-- var a = "That pen s price is 100$. this pen s price is 200$"; var regx = /[0-9]+/g; var b = a.match(regx); document.write("検索対象文字列" + a + " br "); document.write("正規表現" + regx + " br "); document.write("マッチした文字:" + b + " br "); //-- /script h1 繰り返し処理 /h1 h2 for in /h2 script type="text/javascript" !-- for(i in navigator) { document.write(navigator[i]); document.write(" br "); } //-- /script h1 関数の使用 /h1 script type="text/javascript" !-- function func1(a) { return a*2; } document.write("3*2=" + func1(3) + " br " ); //-- /script h1 with文 /h1 script type="text/javascript" !-- with(document) { write("aaa" + " br "); write("bbb" + " br "); } //-- /script h1 マウス右クリック無効化 /h1 script language="JavaScript" !-- function RightOff(e) { if (document.layers e.which == 3){ //NNの場合 alert("右クリックメニューは機能停止しました!"); return false; }else if (document.all event.button == 2) { //IEの場合 alert("右クリックメニューは機能停止しました!"); return false; } return true; } if(document.all){ //IEの場合 document.onmousedown = RightOff; } if(document.layers){ //NNの場合 window.onmousedown = RightOff; window.captureEvents(Event.MOUSEDOWN); } // -- /script firefoxでは無効。 h1 onLoad /h1 p ページを開いたときに起動。bodyタグに記述。 /p h1 onUnLoad /h1 p 別のページに移動したときに起動。bodyタグに記述。 /p a href="http //localhost/PukiWiki/index.php" ホームに移動 /a h1 onBlur/onFocus /h1 form input type="text" onblur="alert( onblur action. )" value="" input type="text" onfocus="alert( onfocus action. )" value="" /form h1 別ウィンドウを開く /h1 h1 タイマー /h1 script type="text/javascript" !-- var cnt = 0; var ret; function rewritePg() { var p = document.getElementById("p1"); if(p == null) { alert("p1 null."); } if( cnt % 2 == 0 ) { p.innerHTML = "bbb"; /** p.firstChild.data = "bbb" でも良い。 */ } else { p.innerHTML = "aaa"; } cnt++; ret = setTimeout("rewritePg()", 2000); } function stopRewrite() { clearTimeout(ret); } //-- /script p 2秒ごとにパラグラフの文字を変える。 /p p id="p1" aaa /p input type="button" value="開始" onClick="rewritePg()" / br input type="button" value="停止" onClick="stopRewrite()" / br / body /html
https://w.atwiki.jp/lmes2/pages/223.html
Javascript TIPS デバッグ Visual Studioで静的HTMLページのJavaScriptコードをデバッグするには? - @IT エンコードとデコード とほほのCookie入門 / エンコードとデコード
https://w.atwiki.jp/909091wiki/pages/38.html
基本設定 Firefox起動時ホームページの表示 ホームページをGoogleに ファイルごとに保存先を指定 スムーズスクロール機能を使用しない ハードウェアアクセラレーションを無効にする 自動スペルチェック機能を使用しない 規定のブラウザか確認しない Firefoxヘルスレポート,クラッシュレポートを送信しない about config // 最後のタブを閉じたらウィンドウも閉じる browser.tabs.closeWindowWithLastTab false // 右クリック無効化の無効化 nglayout.events.dipatchLeftClickOnly true // ステータスバーへのアクセス禁止 capability.policy.default.Window.status noAccess // フレームをリサイズ可能に layout.frames.force_resizability true // 中クリックで貼り付け middlemouse.paste true // スクロールバー上で中クリックで移動 middlemouse.scrollbarPosition true // Javascriptによるウィンドウの制御を無効化 dom.disable_window_flip true dom.disable_window_move_resize true dom.disable_window_status_change true // GUIの変更を無効に dom.disable_window_open_feature.location true dom.disable_window_open_feature.status true dom.event.contextmenu.enabled true // 色管理がうんたら gfx.color_management.enablev4 true アドオン Basic Bookmarks for FF3 + FF4 Context Menu Image Saver DOM Inspector DownloadHelper DownThemAll! Evernote Web Clipper FireGestures Ghostery Greasefire Image Search Options RefControl Scriptish Search By Image (by Google) Stylish UnMHT Vacuum Places Improved ツリー型タブ 赤福、ねないこ、合間合間に Locationbar² Stylish browser @namespace url("http //www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); @namespace html url("http //www.w3.org/1999/xhtml"); @-moz-document url("chrome //browser/content/browser.xul") { /*ブックマークツールバーのアイテムの間を詰める*/ #PlacesToolbarItems toolbarbutton{padding 0 !important} /*ファビコン非表示*/ #PlacesToolbarItems .toolbarbutton-icon{display none !important;} /*サイドバーヘッダー非表示*/ #sidebar-header{display none!important} } Scriptish A killer Mod アフィリンクを置き換える Don t track me Google 検索結果のURLを置き換え Fast look up JP and En Yキーで国語辞典、英英辞典、英和辞典などその他を検索できる nicovideo Add Thumbnail 動画のサムネイルをタイトル左に表示 NivoVideo Additional MyList マイリストをローカルに保存することで500以上の動画をマイリストに入れられる NicoWatch Tools いろいろ // バージョン 0.5.20130123では // Heatmeterの三角が動かないが // 40行付近の var flvplayer = unsafeWindow.document.getElementById( flvplayer ).wrappedJSObject; //を var flvplayer = unsafeWindow.document.getElementById( flvplayer ); //に書き換えることで動作(2013/07/07現在) Show Just Image Twitterとか画像サイトの余計な広告を消して画像だけを表示 Webcomic Reader 矢印キーで漫画の次のページとかその他いろいろ
https://w.atwiki.jp/api_programming/pages/91.html
独自のブラウザー拡張機能を作成する 第 2 回、Firefox を拡張する Building an Extension Firefoxの拡張機能 Firefox の拡張機能は、「アドオン」と呼ばれていますChrome では「拡張機能」、Safari でも「機能拡張」、Internet Explorer では「アドオン」 参考にしたサイトではFirefox バージョン 12 以降 作業 Add-on SDKPython 2.5 or 2.6が必要 https //dev.mozilla.jp/addon-sdk-docs/dev-guide/index.html Add-on Builder は終了 Firefox 拡張機能の構成内容 Firefox 拡張機能を作成する、その他の方法 この記事で説明するプロセスの他にも、Firefox の拡張機能を作成する方法がいくつかあります。Add-on Builder が使用する SDK ファイルは、Developer Hub (「参考文献」を参照) から直接ダウンロードすることができます。この SDK ファイルをダウンロードすると、アドオンを作成するときにお好みの IDE を使用できるようになります。 Add-on Builder の使用方法 https //builder.addons.mozilla.org/ に用意されている Add-on Builder (図 2) を使用するには、無料の登録プロセスを実行する必要があります。このプロセスを完了すれば、Add-on Builder にログインして独自のアドオンを作成することができます。 図 2. Add-on Builder 従来の方法 (つまり昔ながらの XUL を使用した方法) で、拡張機能を作成することもできます。ただし、この方法で拡張機能を作成することには、いくつかの欠点があります。それは、拡張機能のインストールに再起動が必要になること、そして拡張機能を作成するプロセスが複雑になることです。けれどもその見返りとして、Add-on Builder や Add-on SDK では不可能な方法でブラウザーに変更を加えることができます。例えば、XUL では、拡張機能のアイコンをアドオン・バー以外の場所に配置することができます。XUL 拡張機能については、Mozilla Developer Network (「参考文献」を参照) に詳しい説明が記載されています。 Add-on Builder で作成する Firefox 拡張機能は、CommonJS の慣例に従って必要なライブラリーを読み込みます。拡張機能では HTML、CSS、および JavaScript のファイルをどのように組み合わせることもできますが、すべての始まりは main.js ファイルです。 main.js Firefox 拡張機能の中核です。このファイルは Firefox に対し、どのモジュールを読み込むかを指示するため、拡張機能の初期化タスクはこのファイルで行います。Chrome 拡張機能の background.html ページと同じようなものです 起動時に一度だけ実行されると、あとはバックグラウンドで実行され、この main.js ファイルと直接やりとりが行われることはありません。 作成する Firefox 拡張機能の内部には、表示するページを panels に多数含めることができます。この拡張機能ではそのようなページの 1 つとして、図 1 に示すポップアップとオプション選択を組み合わせたページを使用します。 さらに、Firefox でもコンテンツ・スクリプトを使用することができ、その方法は基本的に Chrome での場合と変わりません。 コンテンツ・スクリプト Web ページとやりとりするためにそのページに注入される JavaScript ファイルFirefox では、コンテンツ・スクリプトはページのコンテキスト内で効率的に実行されますが、セキュリティー上の問題を防ぐために、DOM へのアクセスおよび操作はプロキシーを介して行われます。 拡張機能の残りの部分に対しては、コンテンツ・スクリプトは port を使用してやりとりすることができます。 この記事では、Add-on Builder インターフェースの詳細については説明しませんが、ファイル構造について説明しておくべき点が 2 つあります。まず、Lib ディレクトリーは、require を使用してライブラリーを読み込むときに Firefox が検索する場所です。したがって、Gawkblocker のコア JavaScript クラスは、このディレクトリーに配置します。そして Data ディレクトリーは、拡張機能で提供することになる画像、HTML、CSS、およびその他のアセットを配置する場所です。 アドオンを作成してテストするときに、Add-on Builder ヘルパーをインストールするよう求めるプロンプトが出されます。アドオン開発時には、このヘルパーがアドオンのアンインストールとインストールの処理を行います。 上に戻る 第 1 回では、ある程度の移植性を持った Gawkblocker のコア・クラス・ファイルのようなものを作成しました。今回はこのクラス・ファイルを Firefox 拡張機能で使用したいので、実際にそのクラス・ファイルにどの程度の移植性があるかがわかります。 明らかに、このクラス・ファイルには以下の重要な変更を加える必要があります。 localStorage の代わりに、Firefox の simple-storage 拡張 API を使用すること exports に GB オブジェクトを追加すること 第 1 回のクラス・ファイルでは、セッション間で保持するデータを処理するために、localStorage のラッパーとして Storage Manager オブジェクト (SM と命名) を定義しました。そのコードは、Firefox 拡張機能の内部では動作しません。代わりに Firefox には、データを自動的に保持することが可能な simple-storage という API があります。第 1 回の Storage Manager オブジェクトは、リスト 1 に示すコードへと簡単に更新することができます。 GB オブジェクトは変更する必要がありませんが、CommonJS の慣例に従って、このオブジェクトを exports に追加する必要があります。そのタスクに対処するのが、リスト 2 の最後の行です。 リスト 2. exports に GB オブジェクトを追加する これらの変更はごくわずかなので、Firefox でも Chrome でも動作するように GB オブジェクトを変更するのは簡単です (そのための作業は、読者の皆さんがお望みであれば独自のプロジェクトとして行ってください)。 ファイル名を GB.js に変更してから Lib ディレクトリーにアップロードして、main.js 内でのこのオブジェクトの使用方法を確認できるようにしてください。 Chrome では、URL を背景ページと照らし合わせて、その URL がブロックの対象であるかどうかを調べました。Firefox の場合、このチェックは main.js ファイルの内部で行います。main.js が何らかの処理を行うためには、その前に一連の require ステートメントによって、使用する予定のモジュールと API を読み込む必要があります (リスト 3 を参照)。 リスト 3 のステートメントは順番に、main.js に以下のオブジェクトを読み込ように指示します。 Data ディレクトリーにアクセスするために使用するオブジェクト タブを処理するためのオブジェクト メイン・クラスからエクスポートした GB オブジェクト ポップアップ・ウィンドウを格納する popupPanel オブジェクト。このコードは、ポップアップ・ウィンドウも作成します。 さらに作成するポップアップ・ウィンドウは、オプション選択ページとしても機能するため、いくつかのリスナーをセットアップする必要があります。Chrome では、背景ページにアクセスして、このページに対して実行する処理を指示しましたが、Firefox ではそれと同じ目的で、main.js にメッセージを送信します。例えば、リスト 4 に記載するリスナーは、ユーザーがブロック対象として選択したサイトのデフォルト・ランディング・ページを設定します。 リスト 4. ユーザーがブロック対象として選択したサイトのデフォルト・ランディング・ページを設定するリスナー popupPanel.port.on("watchthis", function () { GB.setWatchThisInstead(http //www.youtube.com/watch?v=N-uyWAe0NhQ); console.log("watchthis"); }); 後でポップアップ・ページについて説明するところで、メッセージをこの port に渡します。 main.js ファイルでは、Gawkblocker がタブにアクセスして、ユーザーがブロック対象としている URL があるかどうか、ある場合にはどの URL であるかを調べる処理も行います。リスト 5 に、タブの更新をリッスンするコードを記載します。 関数およびパフォーマンスについては、Chrome での場合と同様です。API の使用方法 (メソッドを呼び出して、コールバックを渡すという方法) も Chrome での場合と変わりません。 最後に、この機能の小さなラベルをブラウザーの右下隅に追加するための Widget を作成します (リスト 6 を参照)。 main.js ファイルに必要なコードをすべて配置した後は、ポップアップ・ページに対する変更について詳しく探ります。 上に戻る Chrome 拡張機能でのポップアップ・ページは、ブロック済みドメインのリストに過ぎませんでした。このポップアップ・ページの設計に手を加えるには、今が絶好のタイミングです。Firefox 拡張機能では、オプション選択ページの機能をポップアップ・ページにマイグレーションします。その上で、クリック・ハンドラーをポップアップ・ページに表示されるタイトルに追加し、ドメイン・リストとオプション選択の div を切り替えられるようにします。このオプション選択の機能によって、ユーザーのサイトからブロック・リストにアクセスして、ブロック済みサイトに対するリダイレクト・アドレスを指定できるようになります。図 3 に、Gawkblocker ポップアップ・ページのオプション選択を示します。 図 3. Gawkblocker ポップアップ・ページのオプション選択 Gawkblocker ポップアップ・ページのオプション選択を表示する Add-on Builder のスクリーン・キャプチャー リスト 4 の port をセットアップするときには、main.js の watchthis をリッスンすることを忘れないでください。リスト 7 では addon.port.emit を使用して、そのメッセージをポップアップ・ページから送信します。 同じく port を使用してリストをリッスンすることで、main.js からブロック対象サイトのリストを取得します。main.js では、ポップアップ・ページからレディー状態であることが通知された時点で、リストを送信します (リスト 8 を参照)。 ポップアップ・オブジェクトの中で、ページをリッスンして、それを変更します (リスト 9 を参照)。 ポップアップ・ページは、main.js にブロック対象サイトのリストを要求します。リストを取得すると、そのリストを繰り返し処理して、ブロック対象サイトに関する詳細をポップアップ・ウィンドウ内の表示 div に追加します。 上に戻る リダイレクト先のランディング・ページ Chrome では、ブロック対象サイトへのリクエストのリダイレクト先が、拡張機能に含まれるランディング・ページとなるようにしました。Firefox ではそれとは異なり、直接、ソース (ランディング・ページに組み込まれた「Hey You! Don t Watch That! Watch This!」という YouTube の URL) へとリダイレクトされるようにします。 main.js に、リスト 10 に示すリダイレクトの初期条件を設定します。 Add-on Builder を使用したテスト Add-on Builder を使用する場合、Firefox では作業中に拡張機能を簡単にテストすることができます。エラー・コンソール、テスト・ボタン、そして拡張機能が保存されるたびに自動的にその最新の拡張機能をリロードする Add-on Builder ヘルパーが用意されています。図 5 に、Add-on Builder ヘルパーの動作を示します。 図 5. Add-on Builder のユーティリティー 拡張機能の配布 作成した拡張機能を大勢の人々に配布する準備ができたら、そこで、いくつかの選択肢のなかから配布方法を選ぶことになります。プロファイルでアドオンを公開アドオンとしてマークした場合は、潜在的ユーザーにリンクを送信することで、そのユーザーがそのリンクからアドオンをインストールすることができます。あるいは、パッケージ化した拡張機能をダウンロードによって配布するという方法、拡張機能を addons.mozilla.org にアップロードするという方法もあります。 ブラウザーの UI のどこかにその拡張機能の存在を示すようにする難易度はどの程度か?ブラウザーの一番下にアドオン・バーを表示するのは、Chrome での場合と比べ、それほど難しいことではありません。Firefox アドオンでは、main.js ファイル内で Widget を作成することで、アドオン・バーが表示されるようにしました。 ブラウザーのセッション間でデータを保持するために必要なものは何か?それには、Firefox 固有の simple-storage API を使用します。1 つの Storage Manager クラスを Chrome と Firefox の両方に共通で動作させるには、何らかの機能検出メカニズムを実装します。 拡張機能を構成するコンポーネント同士はどのような方法でやりとりするのか?この種の通信を作成するには port を使用し、リスナーとエミッターをセットアップします。 ユーザーのデータのどこまでアクセスできるようにするのか?ユーザーからの明示的な許可がなくても、少なくともユーザーがアクセスするすべての URL にアクセスすることはできます。これはかなりの程度です。
https://w.atwiki.jp/oretomonowa/pages/46.html
クロスプラットフォーム・オープンソースウェブブラウザ「Firefox」に関するページ。 アドオンの紹介がメイン。 拡張機能、テーマ、プラグイン、この3つ全ての総称をアドオンという。 2009/07/01より、Firefox 3.5 正式版が公開。 Tab Mix Plus や All-in-One Sidebar といった拡張機能が未対応。 上記2つは開発者のサイトから3.5対応テスト版ビルドをダウンロードすることで使用可能。 FireGestures 等を利用する手もあり。 拡張機能 マウスジェスチャFireGestures All-in-One Gestures 検索ContextSearch Drag&DropZones XUL-Migemo 空白のページの設定変更SpeedDial サイドバーAll-in-One Sidebar タブ関連Tab Mix Plus IE Tab Tab Scope ショートカットキー変更keyConfig function_key_config キーボードでリンクをたどるhit a hint & LoL ツールバーgoogle tool bar セキュリティNoScript フィルタリングAdblock Plus 開発Firebug ダウンロード, キャッシュPDF Download ニコニコ動画ダウンローダ CasheViewer